'use client';

import {useEffect, useState} from 'react';
import styles from './WeatherWidget.module.css';
import {getObj} from "@/services/api_service";

type WeatherData = {
    city: string;
    temperature: string;
    description: string;
};

export default function WeatherWidget() {
    const [weather, setWeather] = useState<WeatherData | null>(null);

    useEffect(() => {
        const getWeather = async () => {
            const response: WeatherData = await getObj('/api/weather/current')
            setWeather(response);
        }
        getWeather()
            .catch((err) => console.error('Ошибка получения данных о погоде:', err));
    }, []);

    return (
        <div className={styles.weatherWidget}>
            {weather ? (
                <>
                    <div className={styles.city}>{weather.city}</div>
                    <div className={styles.temperature}>{weather.temperature}°C</div>
                    <div className={styles.description}>{weather.description}</div>
                </>
            ) : (
                <div className={styles.loading}>Загрузка...</div>
            )}
        </div>
    );
}
